<div class="nav-bar">
    <div class="nav-btn zoom-in" ng-click="minder.execCommand('zoomIn')" title="{{ 'zoom-in' | lang : 'ui' }}"
        ng-class="{ 'active' : getZoomRadio(zoom) == 0 }">
        <div class="icon"></div>
    </div>
    <div class="zoom-pan">
        <div class="origin" ng-style="{'transform': 'translate(0, ' + getHeight(100) + 'px)'}"
            ng-click="minder.execCommand('zoom', 100);"></div>
        <div class="indicator" ng-style="{
             'transform': 'translate(0, ' + getHeight(zoom) + 'px)',
             'transition': 'transform 200ms'
             }"></div>
    </div>
    <div class="nav-btn zoom-out" ng-click="minder.execCommand('zoomOut')" title="{{ 'zoom-out' | lang : 'ui' }}"
        ng-class="{ 'active' : getZoomRadio(zoom) == 1 }">
        <div class="icon"></div>
    </div>
    <div class="nav-btn hand" ng-click="minder.execCommand('hand')" title="{{ 'hand' | lang : 'ui' }}"
        ng-class="{ 'active' : minder.queryCommandState('hand') == 1 }">
        <div class="icon"></div>
    </div>
    <div class="nav-btn camera" ng-click="minder.execCommand('camera', minder.getRoot(), 600);"
        title="{{ 'camera' | lang : 'ui' }}">
        <div class="icon"></div>
    </div>
    <div class="nav-btn nav-trigger" ng-class="{'active' : isNavOpen}" ng-click="toggleNavOpen()"
        title="{{ 'navigator' | lang : 'ui' }}">
        <div class="icon"></div>
    </div>
    <div class="nav-btn hidden" ng-click="showTopMenu()" id="showMenuBtn">
        <svg t="1578220189179" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1914"
            width="25" height="25">
            <path
                d="M383.068024 469.026256l-171.915441 0c-47.39238 0-85.957721-38.533618-85.957721-85.957721l0-171.915441c0-47.39238 38.566364-85.957721 85.957721-85.957721l171.915441 0c47.40773 0 85.957721 38.566364 85.957721 85.957721l0 171.915441C469.025745 430.492638 430.475753 469.026256 383.068024 469.026256L383.068024 469.026256zM426.046884 211.153094c0-23.695678-19.283182-42.97886-42.97886-42.97886l-171.915441 0c-23.680329 0-42.97886 19.283182-42.97886 42.97886l0 171.915441c0 23.712051 19.298532 42.97886 42.97886 42.97886l171.915441 0c23.695678 0 42.97886-19.266809 42.97886-42.97886L426.046884 211.153094 426.046884 211.153094zM383.068024 898.798487l-171.915441 0c-47.39238 0-85.957721-38.518269-85.957721-85.941348l0-171.915441c0-47.39238 38.566364-85.957721 85.957721-85.957721l171.915441 0c47.40773 0 85.957721 38.566364 85.957721 85.957721l0 171.915441C469.025745 860.281241 430.475753 898.798487 383.068024 898.798487L383.068024 898.798487zM426.046884 640.941698c0-23.695678-19.283182-42.97886-42.97886-42.97886l-171.915441 0c-23.680329 0-42.97886 19.283182-42.97886 42.97886l0 171.915441c0 23.712051 19.298532 42.97886 42.97886 42.97886l171.915441 0c23.695678 0 42.97886-19.266809 42.97886-42.97886L426.046884 640.941698 426.046884 640.941698zM877.35664 748.516762c-11.879562 0-21.521153-9.577123-21.521153-21.457708l0-86.117356c0-23.695678-19.283182-42.97886-42.97886-42.97886l-171.915441 0c-23.680329 0-42.97886 19.283182-42.97886 42.97886l0 171.915441c0 23.712051 19.298532 42.97886 42.97886 42.97886l86.117356 0c11.864212 0 21.48943 9.657964 21.48943 21.521153 0 11.83249-9.625218 21.441335-21.48943 21.441335L640.941186 898.798487c-47.39238 0-85.957721-38.518269-85.957721-85.941348l0-171.915441c0-47.39238 38.566364-85.957721 85.957721-85.957721l171.915441 0c47.40773 0 85.957721 38.566364 85.957721 85.957721l0 86.117356C898.814348 738.939639 889.188106 748.516762 877.35664 748.516762L877.35664 748.516762zM812.856627 469.026256l-171.915441 0c-47.39238 0-85.957721-38.533618-85.957721-85.957721l0-171.915441c0-47.39238 38.566364-85.957721 85.957721-85.957721l171.915441 0c47.40773 0 85.957721 38.566364 85.957721 85.957721l0 171.915441C898.814348 430.492638 860.264357 469.026256 812.856627 469.026256L812.856627 469.026256zM855.835488 211.153094c0-23.695678-19.283182-42.97886-42.97886-42.97886l-171.915441 0c-23.680329 0-42.97886 19.283182-42.97886 42.97886l0 171.915441c0 23.712051 19.298532 42.97886 42.97886 42.97886l171.915441 0c23.695678 0 42.97886-19.266809 42.97886-42.97886L855.835488 211.153094 855.835488 211.153094z"
                p-id="1915" fill="#FFFFFF"></path>
        </svg>
    </div>
</div>
<div class="nav-previewer" ng-show="isNavOpen"></div>